<?php
	$ls_gridname	= 'dtl_absen';
?>

<script>
	// --- Ginting ----
	var idKaryawan = $('#id_karyawan_pk').getval();
	var tglTerakhir = "";
	var bulanTahun = "";
	var periodeAwal = "";
	var periodeAkhir = "";
	var aktif = false;
	var listStatusAbsen = <?php echo json_encode($listStatusAbsen) ?>;

	function comboFormatter(value){
		for(var i=0; i<listStatusAbsen.length; i++){
			if (listStatusAbsen[i].value == value) return listStatusAbsen[i].display;
		}
		return value;
	}

	// Simpan perubahan detail absen
	function simpanDetailAbsen() {
		// console.log("simpan gan");
		$('#<?php echo $ls_gridname; ?>').datagrid('acceptChanges');

		var listData = $('#<?php echo $ls_gridname; ?>').datagrid('getData');
		// console.log(listData);
        $.each(listData.rows, function( index, value ) {
            if (value.id_status_absen_fk == null) { val_status_absen = ''; }
            else { val_status_absen = value.id_status_absen_fk; }

            if (value.tgl_masuk == null) { val_tgl_masuk=''; } else{val_tgl_masuk=value.tgl_masuk;};
            // if (value.tgl_keluar == null) { val_tgl_keluar=''; } else{val_tgl_keluar=value.tgl_keluar;};
            if (value.jam_masuk == null) { val_jam_masuk=''; } else{val_jam_masuk=value.jam_masuk;};
            if (value.jam_keluar == null) { val_jam_keluar=''; } else{val_jam_keluar=value.jam_keluar;};
            // if (value.telat == null) { val_telat=''; } else{val_telat=value.telat;};
            // if (value.potongan == null) { val_potongan=''; } else{val_potongan=value.potongan;};

            jQuery.ajax({
              url: gs_path+'/'+controller+'/edit_baris',
              type: 'POST',
              dataType: 'html',
              data: {
              	badgeno: $('#no_finger_scan').val(),
              	badgename: $('#nama_karyawan').val(),
              	date: val_tgl_masuk,
              	in_: val_jam_masuk,
              	out_: val_jam_keluar,
              	ot_: '',
              	id_status_absen_fk: val_status_absen
              },
              success: function(data, textStatus, xhr) {
                //called when successful
                console.log(data);
              },
              error: function(xhr, textStatus, errorThrown) {
                //called when there is an error
                console.log('eror');
              }
            });

        });

		// reload tabel
        proses();
	}

	// Mengambil Id Jadwal
	function reloadTabel(periode,grubAbsen) {
		aktif = true;
		$.ajax({
			url:gs_path+"/"+controller+'/get_id_jadwal',
			dataType:'json',
			type:"GET",
			data: {
				id_periode_fk:periode,
				id_grub_absen_fk:grubAbsen
			},
			success:function(data) {
                // reload detail absen berdasarkan id jadwal
				idJadwal = data.id_jadwal_pk;
				$('#<?php echo $ls_gridname; ?>').datagrid('load',{
					idJadwal: idJadwal,
					idKaryawan: idKaryawan
				});
            }, error: function(errorThrown) { 
                console.log("ajax error detail_absen.php->reloadTabel! ");
            }  
		});
	}

	// Mengambil Periode untuk melihat tgl awal dan tgl akhir
	function ambilPeriode(periode) {
		$.ajax({
			url:gs_path+"/"+controller+'/get_periode',
			dataType:'json',
			type:"GET",
			data: {
				id_periode_fk:periode
			},
			success:function(data) {
				periodeAwal = data.tgl_mulai;
				periodeAkhir = data.tgl_selesai;
            }, error: function(errorThrown) { 
                console.log("ajax error detail_absen.php->ambilPeriode! ");
            }  
		});
	}
	// --- end Ginting ----

	/*var products = [
	    {productid:'FI-SW-01',name:'Koi'},
	    {productid:'K9-DL-01',name:'Dalmation'},
	    {productid:'RP-SN-01',name:'Rattlesnake'},
	    {productid:'RP-LI-02',name:'Iguana'},
	    {productid:'FL-DSH-01',name:'Manx'},
	    {productid:'FL-DLH-02',name:'Persian'},
	    {productid:'AV-CB-01',name:'Amazon Parrot'}
	];
	function productFormatter(value){
		for(var i=0; i<products.length; i++){
			if (products[i].productid == value) return products[i].name;
		}
		return value;
	}*/
	

	$(function(){
		var lastIndex;
		$('#<?php echo $ls_gridname; ?>').datagrid({
			url:gs_path+'/'+controller+'/getdata/', 
			fitColumns:true,
			// method:'GET',
			toolbar:[
			/*{
				text:'append',
				iconCls:'icon-add',
				handler:function(){

					// sarginsu
					// Mengambil data tabel
					var dataTabel = $('#<?php echo $ls_gridname; ?>').datagrid('getRows');
					if (periodeAkhir.substring(0,2) > dataTabel.length) {
						var urutan = dataTabel.length+1;

						if(dataTabel.length == 0) {
							tglTerakhir = periodeAwal;
							bulanTahun = tglTerakhir.substring(2);
						} else {
							// Set Nilai Bulan dan Tahun
							if(tglTerakhir == "") {
								$.each( dataTabel, function( key, value ) {
								  	tglTerakhir = value.tgl_masuk;
									bulanTahun = tglTerakhir.substring(2);
								});
							}
						}

						// Set Tgl yg di input
						var tglInput = urutan+bulanTahun;
						if (urutan.toString().length == 1) {
							tglInput = "0"+tglInput;
						}

						var idAbsen = idKaryawan+"-"+idJadwal+"-"+urutan;
						$('#<?php echo $ls_gridname; ?>').datagrid('endEdit', lastIndex);
						$('#<?php echo $ls_gridname; ?>').datagrid('appendRow',{
							id_absen_pk:idAbsen,
							id_jadwal_fk:idJadwal,
							tgl_masuk:tglInput,
							tgl_keluar:tglInput,
							jam_masuk:'00:00',
							jam_keluar:'00:00',
							id_status_absen_fk:'',
							urutan:urutan
						});
						lastIndex = $('#<?php echo $ls_gridname; ?>').datagrid('getRows').length-1;
						$('#<?php echo $ls_gridname; ?>').datagrid('selectRow', lastIndex);
						$('#<?php echo $ls_gridname; ?>').datagrid('beginEdit', lastIndex);
					} else {
						if(aktif == false) {
							$.messager.alert('Info','Silahkan Klik Tombol Proses Terlebih Dahulu!','info');
						} else {
							$.messager.alert('Info','Batas Untuk Periode Ini sudah Terpenuhi!','info');
						}
					}
				}
			},'-',*/
			/*{
				text:'delete',
				iconCls:'icon-remove',
				handler:function(){
					var row = $('#<?php echo $ls_gridname; ?>').datagrid('getSelected');
					if (row){
						var index = $('#<?php echo $ls_gridname; ?>').datagrid('getRowIndex', row);
						$('#<?php echo $ls_gridname; ?>').datagrid('deleteRow', index);
					}
				}
			},'-',*/
			{
				text:'accept',
				iconCls:'icon-save',
				handler:function(){
					if(aktif == false) {
						$.messager.alert('Info','Silahkan Klik Tombol Proses Terlebih Dahulu!','info');
					} else {
						simpanDetailAbsen();
						$.messager.alert('Info','Data Tersimpan!','info');
					}
				}
			},'-',
			{
				text:'reject',
				iconCls:'icon-undo',
				handler:function(){
					if(aktif == false) {
						$.messager.alert('Info','Silahkan Klik Tombol Proses Terlebih Dahulu!','info');
					} else {
						$('#<?php echo $ls_gridname; ?>').datagrid('rejectChanges');
					}
				}
			},'-',
			{
				text:'Print',
				iconCls:'icon-print',
				handler:function(){
					$.messager.alert('Info','Fitur print segera menyusul di update berikutnya','info');
				}
			}],
			onBeforeLoad:function(){
				$(this).datagrid('rejectChanges');
			},
			onClickRow:function(rowIndex){
				if (lastIndex != rowIndex){
					$('#<?php echo $ls_gridname; ?>').datagrid('endEdit', lastIndex);
					$('#<?php echo $ls_gridname; ?>').datagrid('beginEdit', rowIndex);
				}
				lastIndex = rowIndex;
			},
			rowStyler:function(index,row,css){
				if (row.hari=='Minggu'){
					return 'background-color:#FF0080;color:#fff;font-weight:bold;';
				}
			}
		});
	});
</script>

<table id="<?php echo $ls_gridname; ?>" style="width:auto;height:auto" iconCls="icon-edit" singleSelect="true" idField="itemid">
	<thead>
		<tr>
			<!-- <th field="id_absen_pk" width="170">Absen ID</th> -->
			<!-- <th field="id_jadwal_fk" width="80">Jadwal</th> -->
			<th field="hari" width="80">Hari</th>
			<th field="tgl_masuk" width="100">Tgl Masuk</th>
			<!-- <th field="tgl_keluar" width="100" editor="text">Tgl Keluar</th> -->
			<th field="tgl_keluar" width="100">Tgl Keluar</th>
			<th field="jam_masuk" width="80" editor="text">Jam Masuk</th>
			<th field="jam_keluar" width="80" editor="text">Jam Keluar</th>
			<th field="telat" width="50">Telat</th>
			<th field="cepat_pulang" width="80">Cepat Pulang</th>
			<th field="potongan" width="80" formatter="formatNumeric">Potongan</th>
			<!-- <th field="telat" width="50" editor="text">Telat</th>
			<th field="cepat_pulang" width="80" editor="text">Cepat Pulang</th>
			<th field="potongan" width="80" editor="text" formatter="formatNumeric">Potongan</th> -->
			<th field="id_status_absen_fk" width="80" formatter="comboFormatter" editor="{type:'combobox',options:{valueField:'value',textField:'display',data:listStatusAbsen}}">Status</th>
			<!-- <th field="urutan" width="50">Urutan</th> -->
		</tr>
	</thead>
</table>
